<template>
	<view class="content">
		<uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
			<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
				<swiper-item v-for="(item, index) in data" :key="index">
					<view class="swiper-item" @click="clickBannerItem(item)">
						<image :src="item.image" mode="aspectFill" :draggable="false" />
					</view>
				</swiper-item>
			</swiper>
		</uni-swiper-dot>
		<view class="content-section">
			<view class="mine-actions grid col-3 text-center">
				<view class="action-item" @click="handleApproveDZL">
					<view class="iconfont icon-diaoji text-blue  icon"></view>
					<text class="text">吊装令</text>
				</view>
				<view class="action-item" @click="handleApproveDHL">
					<view class="iconfont icon-donghuoling text-pink icon"></view>
					<text class="text">动火令</text>
				</view>
				<view class="action-item" @click="handleApproveDTL">
					<view class="iconfont icon-xuanwazuanji text-blue icon"></view>
					<text class="text">移机令</text>
				</view>
			</view>
		</view>
		<view>
			<scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="getData()">
				<view class="scroll-view-item" v-for="(item,index) in dataList" :key="index">
					<view class="span1">
						{{item.type==1?'吊装令':item.type==2?'动火令':item.type==3?'':'移机令'}}
					</view>
					<view class="span2">
						作业班组:{{item.workTeam}}
					</view>
					<view class="span2">
						施工时间:{{parseTime(item.startTime,'{y}-{m}-{d}')}}至{{parseTime(item.endTime,'{y}-{m}-{d}')}}
					</view>

					<view class="span4">
						{{item.status == 0
              ? "待技术部门审核"
              : item.status == 1
              ? "待安全部门审核"
              : item.status == 2
              ? "待负责人审核"
              : item.status == 3
              ? "待现场监理审核"
              : item.status == 4
              ? "待安全监理审核"
              : item.status == 5
              ? "通过"
              : item.status == 6
              ? "不通过"
              : ""}}
					</view>
					<view class="span5">
						<view class="but" @click="handleReview(item,1)"
							v-if="gethasPermi(['system:homework:jssh'])&&item.status==0">
							技术部门审核
						</view>
						<view class="but" @click="handleReview(item,2)"
							v-if="gethasPermi(['system:homework:aqsh'])&&item.status==1">
							安全部门审核
						</view>
						<view class="but" @click="handleReview(item,3)"
							v-if="gethasPermi(['system:homework:fzrsh'])&&item.type==1&&item.status==2">
							负责人审核
						</view>
						<view class="but" @click="handleReview(item,5)"
							v-if="gethasPermi(['system:homework:fzrsh'])&&item.type!=1&&item.status==2">
							负责人审核
						</view>
						<view class="but" @click="handleReview(item,4)"
							v-if="gethasPermi(['system:homework:xcjl'])&&item.status==3">
							现场监理审核
						</view>
						<view class="but" @click="handleReview(item,5)"
							v-if="gethasPermi(['system:homework:aqjl'])&&item.status==4">
							安全监理审核
						</view>
					</view>
				</view>

			</scroll-view>
		</view>
	</view>
</template>
<script>
	import {
		listHomework
	} from "@/api/homework";
	import {
		checkPermi
	} from "@/utils/permission.js"
	export default {
		data() {
			return {
				current: 0,
				swiperDotIndex: 0,
				data: [{
						image: '/static/images/secure/secure01.png'
					},
					{
						image: '/static/images/secure/secure02.png'
					},
					{
						image: '/static/images/secure/secure03.png'
					}
				],
				dataList: [],
				total: 1,
				queryParams: {
					pageNum: 0,
					pageSize: 10,
				}
			}
		},
		mounted() {
			this.getData()
		},
		methods: {
			gethasPermi(val) {
				return checkPermi(val)

			},
			handleReview(item, status) {
				this.$tab.navigateTo('/pages/details/index?id=' + item.id + '&status=' + status)
			},
			getData() {
				if (this.dataList < this.total) {
					this.queryParams.pageNum++
					listHomework(this.queryParams).then((res) => {
						this.total = res.total
						this.dataList = [...this.dataList, ...res.rows]

					})
				}

			},
			clickBannerItem(item) {
				console.info(item)
			},
			changeSwiper(e) {
				this.current = e.detail.current
			},
			handleApproveDZL() {
				this.$tab.navigateTo('/pages/approveDZL/index')
			},
			handleApproveDHL() {
				this.$tab.navigateTo('/pages/approveDHL/index')
			},
			handleApproveDTL() {
				this.$tab.navigateTo('/pages/approveDTL/index')
			},
			handleMyApprove() {},
			lower(e) {
				console.log(e)
			},
			parseTime(time, pattern) {
				if (arguments.length === 0 || !time) {
					return null
				}
				const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
				let date
				if (typeof time === 'object') {
					date = time
				} else {
					if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
						time = parseInt(time)
					} else if (typeof time === 'string') {
						time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm),
							'');
					}
					if ((typeof time === 'number') && (time.toString().length === 10)) {
						time = time * 1000
					}
					date = new Date(time)
				}
				const formatObj = {
					y: date.getFullYear(),
					m: date.getMonth() + 1,
					d: date.getDate(),
					h: date.getHours(),
					i: date.getMinutes(),
					s: date.getSeconds(),
					a: date.getDay()
				}
				const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
					let value = formatObj[key]
					// Note: getDay() returns 0 on Sunday
					if (key === 'a') {
						return ['日', '一', '二', '三', '四', '五', '六'][value]
					}
					if (result.length > 0 && value < 10) {
						value = '0' + value
					}
					return value || 0
				})
				return time_str
			}

		}
	}
</script>

<style lang="scss" scoped>
	.content {
		.swiper {
			height: 300rpx;
		}

		.swiper-box {
			height: 150px;
		}

		.swiper-item {
			/* #ifndef APP-NVUE */
			display: flex;
			/* #endif */
			flex-direction: column;
			justify-content: center;
			align-items: center;
			color: #fff;
			height: 300rpx;
			line-height: 300rpx;
		}

		@media screen and (min-width: 500px) {
			.uni-swiper-dot-box {
				width: 400px;
				/* #ifndef APP-NVUE */
				margin: 0 auto;
				/* #endif */
				margin-top: 8px;
			}

			.image {
				width: 100%;
			}
		}
	}

	.content-section {
		position: relative;
		top: 0px;

		.mine-actions {
			margin: 15px 15px;
			padding: 20px 0px;
			border-radius: 8px;
			background-color: white;

			.action-item {
				.icon {
					font-size: 28px;
				}

				.text {
					display: block;
					font-size: 13px;
					margin: 8px 0px;
				}
			}
		}
	}

	.scroll-Y {
		height: 720rpx;
	}

	.scroll-view-item {
		height: 150rpx;
		border-radius: 10px;
		background-color: #fff;
		margin: 25rpx;
		padding: 10rpx;
		box-sizing: border-box;
		position: relative;

		.span1 {
			font-size: 16px;
			color: #55aaff
		}

		.span2 {
			color: #787878
		}

		.span4 {
			position: absolute;
			right: 10px;
			top: 10px;
			color: #aa0000;
		}

		.span5 {
			position: absolute;
			right: 10px;
			bottom: 10px;
			color: #FFF;

			.but {
				background-color: #00aaff;
				padding: 5px 10px;
				border-radius: 10px;
			}
		}
	}
</style>